import React from 'react'
import {BrowserRouter} from 'react-router-dom';

import {Provider} from 'mobx-react';
import stores from '@src/store';
import RouteComponent from './RouteComponent';
import WebHeader from '@components/Header' 
import {Layout} from 'antd';
import './index.less'


const {Header, Footer, Sider, Content} = Layout;

export default (props) => (
    <Provider {...stores}>
        <BrowserRouter>
            <Layout>
                <Header>
                    <WebHeader />
                </Header>
                <Layout className="whole-content">
                    <Sider style={{background: 'grey', color: 'white'}}>Sider</Sider>
                    <Content className="main-router">
                        <RouteComponent />
                    </Content>
                </Layout>

                <Footer>Footer</Footer>
            </Layout>
        </BrowserRouter>
    </Provider>
)